<template>
  <div>
    <div class="box-t">意见反馈</div>
    <div class="box-b">
      <a-form
        :form="form"
        class="forms"
        labelAlign="left"
        :labelCol="{span:3}"
        :wrapperCol="{span:20}"
      >
        <a-form-item label="手机号码">
          <a-input
            placeholder="请输入您的手机号，方便我们联系您"
            v-decorator="['phone', { rules: [{ required: true, message: '请输入手机号码！' }] }]"
          />
        </a-form-item>
        <a-form-item label="反馈内容">
          <a-textarea
            placeholder="您可以告诉我们：想买什么没有？要买什么不行？用得哪里不爽？还有哪些新的想法"
            :autoSize="{ minRows: 6, maxRows: 18 }"
            v-decorator="['test', { rules: [{ required: true, message: '请输入反馈内容！' }] }]"
          />
        </a-form-item>
        <a-form-item :wrapper-col="{ span: 4, offset: 3 }">
          <a-button type="primary" class="btn" @click="onSubmit">确定</a-button>
        </a-form-item>
      </a-form>
    </div>
  </div>
</template>

<script>
import { FEEDBACK } from "../server";
export default {
  layout: "main",
  data() {
    return {
      form: this.$form.createForm(this, {
        name: "feedback"
      })
    };
  },
  created() {},
  methods: {
    onSubmit(e) {
      e.preventDefault();
      this.form.validateFields((err, values) => {
        if (!err) {
          if (!this.$store.state.member_id) {
            this.$store.commit("loginSoft", true);
            return;
          }
          FEEDBACK({
            phone: this.form.getFieldValue("phone"),
            test: this.form.getFieldValue("test"),
            type: 1
          }).then(res => {
            if (res.code != 200) {
              this.$message.error(res.msg);
              return;
            } else {
              this.$message.success(res.msg);
            }
          });
        }
      });
    }
  }
};
</script>
<style lang="less" scoped>
.box-t {
  height: 36px;
  line-height: 36px;
  padding-left: 10px;
  background: #f6f6f6;
  border: 1px solid #e8e8e8;
  border-bottom: 0;
}
.box-b {
  padding: 20px;
  border: 1px solid #e8e8e8;
  input {
    width: 382px;
  }
  textarea {
    width: 382px;
    min-height: 200px;
  }
  .btn {
    width: 158px;
    height: 44px;
  }
}
</style>